<template>
  <div>
    <div class="detailsTop">
      <span style="display: block;text-align: left">凤眼订单号：{{orderNumber}}</span>
      <el-table
          :data="tableData"
          border
          style="width: 100%">
        <el-table-column
            prop="movieName"
            label="影片"
            width="180">
        </el-table-column>
        <el-table-column
            prop="startTime"
            label="时间"
            width="180">
        </el-table-column>
        <el-table-column
            prop="cinema"
            label="影院">
        </el-table-column>
        <el-table-column
            prop="seat"
            label="座位">
        </el-table-column>
        <el-table-column
            prop="money"
            label="票价">
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  name: "UserOrderDetailsView",
  data() {
    return {
      orderNumber: this.$route.query.orderNumber,
      tableData: []
    }
  },
  created() {
    this.handleGetUserOrderDetails()
  },
  methods: {
    handleGetUserOrderDetails(){
      console.log(this.$route.query.orderNumber)
      this.axios.get("/web/order/details", {params: {orderNumber: this.$route.query.orderNumber}}).then(response => {
        if (response.data.code == 200){
          this.tableData = response.data.data
          console.log(this.tableData)
        }
      })
    }
  }
}
</script>

<style scoped>
  .detailsTop{
    width: 60%;
    overflow: hidden;
    margin: 0 auto;
  }
</style>